<!DOCTYPE html>
<html>
<head>
	<!-- Article: http://www.paulrhayes.com/2010-09/3d-css-cube-ii-touch-gestures-click-and-drag/ -->
	<!-- Demo: http://www.paulrhayes.com/experiments/cube-3d/touch.html -->
	<!-- Originally posted: 28th September 2010 -->
	<meta charset="UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title></title>
	<meta name="author" content="Paul Hayes" />

	<link rel="stylesheet" href="css/ctrl/compass.css" />		
	<!--[if lt IE 9]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body class="experiment">
	<div id="wrapper">
<article id="viewport">	
	<section id="cube">
        <div>
			<p>I also work on the UK price comparison site, <a href="http://www.media-pricer.co.uk" target="_top">Media Pricer</a>, feel free to give us some love.</p>
        </div>
        <div>
			<h2>3D cube</h2>
			<time>28th September 2010</time>
			<p>By Paul Hayes</p>
			<p>3D cube built using css, webkit-perspective and webkit-transform. Rotation via webkit-transition.</p>
			<p>Use arrow keys to navigate, or click and hold mouse. On touch screens, use one finger to rotate. Press ESC to reset.</p>
			<p><a href="http://www.paulrhayes.com/2010-09/3d-css-cube-ii-touch-gestures-click-and-drag/" target="_top">Read more &raquo;</a></p>
			
        </div>
        <div>
        	<!-- video -->
        </div>
        <div>
        	<h2><a href="http://www.paulrhayes.com/2009-07/animated-css3-cube-interface-using-3d-transforms/" target="_top">Learn how to make a cube</a></h2>
			<time>17th July 2009</time>
			<p>By Paul Hayes</p>
			<p>&#8220;A 3D cube can be cre­ated solely in CSS, with all six faces.&#8221;</p>
			<p>Article: <a href="http://www.paulrhayes.com/2009-07/animated-css3-cube-interface-using-3d-transforms/" target="_top">Cube explanation</a></p>
        </div>
        <div>
			<p>I design and build websites in Brighton</p>
        </div>
        <div>
			<small>Nothing down here.</small>
        </div>
    </section>	
</article>
	</div>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script src="js/ctrl/compass.js"></script>	</body>
</html>